<template>
  <div class="cardy" >
    <img :src="moodsList.pic" alt="" />
    <div class="footer">
      <p v-html="moodsList.name"></p>
      <li v-html="moodsList.characteristic"></li>
      <u style="color:red;">￥{{ moodsList.minPrice }}</u>
    </div>
  </div>
</template>

<script>
export default {
  props: ["moodsList"],
  data() {
    return {};
  },
  mounted() {},
  methods: {},
  components: {},
};
</script>

<style lang="scss" scoped>
.cardy {
  width: 48%;
  height: 550px;
  background-color: #fff;
  font-size: 26px;
  padding: 10px;
  border-radius: 15px;
  img {
    border-radius: 15px;
    width: 100%;
    height: 72%;
  }
  margin: 5px;
}
.footer {
  display: flex;
  height: 30%;
  flex-direction: column;
  justify-content: space-around;
}
</style>
